<template>
	<div style="height: 100vh;z-index: 1;position: relative;background-color:#FFFFFF;">
		<div @click="goback" class="goback">返回</div>
		<div class="login">
			<form style="text-align: center" action="">
				<input @blur="accountIsExist" @focus="accountIs=false" v-model="account" class="box" placeholder="请输入手机号"  type="text">
				<input class="box" v-model="password" placeholder="请输入密码" type="password" name="" id="">
			</form>
			<div style="display: flex">
				<div @click="isLogin" class="login-button">
					登录
				</div>
				<div @click="toregister" class="register-button">
					注册
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: "Login",
		data(){
			return{
				account:'',
				password:''
			}
		},
		methods:{
			goback(){
				this.$router.go(-1)
			},
			isLogin(){

				this.$axios({
					method:'post',
					url:'/isRegister',
					data:{
						account:this.account,
						password: this.password
					}
				}).then((res)=>{
					console.log(res.data)
					if(res.data==200){
						this.$store.commit('changeIslogin')
						console.log(this.$store.state.isLogin)
						this.$router.push({
							path:'/profile'
						})
					}
					else {
						this.$notify.error({
							title: '用户名或密码错误',
							showClose: false
						});
					}
				}).catch(function (error) {
					console.log(error);
				})
				//this.$router.push('/profile')
			},
			accountIsExist(){

			},
			toregister(){
				this.$router.push({
					path:'/register'
				})
			}
		}
	}
</script>

<style scoped>
	.tip{
		align-self: flex-start;padding-left: 12vw;color: red;font-size: 14px;
	}
	.goback{
		width: 96vw;
		height: 6vh;
		line-height: 6vh;
		font-size: 20px;
		font-weight: bold;
		padding-left: 4vw;
		background-color: #eeeeee;
		color: #aaaaaa;
	}
	.login{
		display: flex;
		flex-flow: column;
		justify-content: center;
		align-items: center;
		padding-top: 3vh;
	}
	.box{
		height: 5vh;
		width: 75%;
		margin: 10px 0;
		font-size: 18px;
		border: none;
		border-bottom: 0.5px solid #555555;
	}
	.login-button{
		width: 25vw;
		height: 5vh;
		font-size: 20px;
		font-weight: 600;
		line-height: 5vh;
		border-radius: 25px;
		background-color: #2395ff;
		text-align: center;
		color: #FFFFFF;
		margin: 5vw 8vw;
	}

	.register-button{
		width: 25vw;
		height: 5vh;
		font-size: 20px;
		font-weight: 600;
		line-height: 5vh;
		border-radius: 25px;
		background-color: #38ca73;
		text-align: center;
		color: #FFFFFF;
		margin: 5vw 8vw ;
	}
</style>
